<route lang="json5">
{
  style: {
    navigationStyle: 'default',
    navigationBarTitleText: '登录',
  },
}
</route>

<template>
  <view ml mr>
    <uv-form
      ref="loginForm"
      label-position="top"
      label-width="100rpx"
      v-model="loginCmd"
      :rules="rules"
    >
      <uv-form-item label="用户名" prop="identifier" borderBottom>
        <uv-input v-model="loginCmd.identifier" placeholder="USERNAME"></uv-input>
      </uv-form-item>
      <uv-form-item label="密码" prop="credential" borderBottom>
        <uv-input :password="!passwordVisible" placeholder="PASSWORD" v-model="loginCmd.credential">
          <template #suffix>
            <uv-icon
              v-if="passwordVisible"
              name="eye-fill"
              @click="passwordVisible = false"
            ></uv-icon>
            <uv-icon v-else name="eye-off" @click="passwordVisible = !passwordVisible"></uv-icon>
          </template>
        </uv-input>
      </uv-form-item>
      <uv-button type="primary" @click="doLogin">登录</uv-button>
      <view mt w-full>
        <!-- @unocss-skip-start-->
        <uv-text
          text="没有账号? 点击注册 >>"
          @click="toRegister"
          align="center"
          decoration="underline"
        ></uv-text>
        <!-- @unocss-skip-end-->
      </view>
    </uv-form>
  </view>
</template>

<script setup lang="ts">
import { goBack } from '@/utils/route'
import { showSuccess } from '@/utils/toast'
import { loginAPI } from '@/service/auth/auth'
import type { LoginCmd } from '@/service/auth/type'
import { useAuthStore } from '@/store'
import { FormRules } from '@ttou/uv-typings/types/form'

const loginForm = ref<any>(null)
const passwordVisible = ref(false)
const loginCmd = reactive<LoginCmd>({
  authTypeCode: 'PASSWORD',
  identifier: '',
  credential: '',
})
const rules = ref<FormRules>()
const useAuth = useAuthStore()
const doLogin = async () => {
  const resData = await loginAPI(loginCmd)
  if (resData.code === 0) {
    useAuth.setToken(resData.data)
    showSuccess('登录成功', {
      success: () => {
        setTimeout(() => {
          goBack(getCurrentPages())
        }, 1000)
      },
    })
  }
}
const toRegister = () => {
  uni.$uv.route('/pages/register/register')
}
</script>

<style scoped lang="scss"></style>
